/*
 * Copyright (c) 2025 Huawei Device Co., Ltd.
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

import 'package:flutter/material.dart';
import 'package:hadss_adaptive_layout/hadss_adaptive_layout.dart';

import '../../../l10n/generated/app_localizations.dart';

class PayComponent extends StatefulWidget {
  final WidthBreakpoint screenType;
  final double currentWidth;
  const PayComponent(
      {Key? key, required this.screenType, required this.currentWidth})
      : super(key: key);

  @override
  State<PayComponent> createState() => _PayComponentState();
}

class _PayComponentState extends State<PayComponent> {
  @override
  Widget build(BuildContext context) {
    AppLocalizations il8n = AppLocalizations.of(context)!;
    return SizedBox(
        width: widget.currentWidth,
        height: 48,
        child: Container(
          margin: const EdgeInsets.only(left: 10, right: 10),
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: const BorderRadius.all(Radius.circular(10)),
            boxShadow: [
              BoxShadow(
                color: Colors.grey.withOpacity(0.5), // 阴影颜色
                spreadRadius: 2, // 阴影扩散半径
                blurRadius: 5, // 阴影模糊半径
                offset: const Offset(2, 3), // 阴影偏移量 (x, y)
              ),
            ],
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              SizedBox(
                width: 200,
                child: Row(
                  children: [
                    Image.asset('lib/assets/images/music/music_home_page.png'),
                    Container(
                      margin: const EdgeInsets.only(top: 8),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(il8n.myMusicTitle),
                          Text(
                            il8n.author,
                            style: const TextStyle(
                                fontSize: 10,
                                color: Color.fromRGBO(0, 0, 0, 0.4)),
                          )
                        ],
                      ),
                    ),
                  ],
                ),
              ),
              Expanded(
                  child: DisplayPriorityBox(
                mainAxisAlignment: widget.screenType == WidthBreakpoint.lg ||
                    widget.screenType == WidthBreakpoint.xl
                    ? MainAxisAlignment.center :MainAxisAlignment.end,
                direction: Axis.horizontal,
                displayPriorityList: [
                  DisplayPriorityObject(
                      displayPriority: 2,
                      child: Container(
                          margin: const EdgeInsets.only(right: 10),
                          child: Image.asset(
                              'lib/assets/images/music/music_ic_sequence.png'))),
                  DisplayPriorityObject(
                      displayPriority: 2,
                      child: Container(
                          margin: const EdgeInsets.only(right: 10),
                          child: Image.asset(
                              'lib/assets/images/music/minibar_ic_previous_song.png'))),
                  DisplayPriorityObject(
                    displayPriority: 3,
                    child: Container(
                        margin: EdgeInsets.only(
                            right: widget.screenType == WidthBreakpoint.lg ||
                                    widget.screenType == WidthBreakpoint.xl
                                ? 50
                                : 10,
                            left: widget.screenType == WidthBreakpoint.lg ||
                                    widget.screenType == WidthBreakpoint.xl
                                ? 50
                                : 0),
                        child: Image.asset(
                            'lib/assets/images/music/music_pay.png')),
                  ),
                  DisplayPriorityObject(
                      displayPriority: 2,
                      child: Container(
                          margin: const EdgeInsets.only(right: 10),
                          child: Image.asset(
                              'lib/assets/images/music/minibar_ic_next_song.png'))),
                  DisplayPriorityObject(
                      displayPriority: 99,
                      child: Container(
                          margin: const EdgeInsets.only(right: 10),
                          child: Image.asset(
                              'lib/assets/images/music/minibar_ic_play_next.png'))),

                ],
              )),
              widget.screenType == WidthBreakpoint.lg ||
                  widget.screenType == WidthBreakpoint.xl
                  ?  Container(
                      margin: const EdgeInsets.only(right: 10, left: 10),
                      child: Image.asset(
                          'lib/assets/images/music/icon_collection.png'))
                  :  Container(),
            ],
          ),
        ));
  }
}
